<template>
	<view class="wrap">
		<custom-nav-sq-xcx :isBack="true" :needConBlock="true" conCol="#000" currMod="sqMineMod">
			<template v-slot:content>我的反馈</template> 
		</custom-nav-sq-xcx>
		<sq-order-tab
			currMod="feedBack"
			:orderStaArr="orderStaArr"
			:orderStaIndex="orderStaIndex"
			@swithOrderTab="swithOrderTab"
		></sq-order-tab>
		<view class="padd">
			<view class="feedBackItem">
				<view class="itemTit">
					<text>社情反应</text>
					<text class="till">|</text>
					<text>分开就打瞌睡过分的离开过家发的老公反倒是聚福楼看电视减肥</text>
				</view>
				<view class="itemBtnGp spaceBet">
					<text>2023-12-20 12:20:23</text>
					<view class="status">处理中</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import SqOrderTab from '../components/SqOrderTab'
	export default {
		components:{
			SqOrderTab
		},
		data(){
			return{
				orderStaArr:[
					{id:1,name:'未处理'},
					{id:2,name:'处理中'},
					{id:3,name:'已完结'},
				],
				orderStaIndex:0
			}
		},
		methods:{
			swithOrderTab(index,item){
				this.orderStaIndex = index;
			}
		}
	}
</script>

<style lang="scss">
	page{background: $sq-fuf;}
</style>
<style lang="scss" scoped>
	.wrap{
		padding:100rpx 0 1rpx;
	}
	.feedBackItem{
		background: #fff;
		padding: 20rpx;
		border-radius: 16rpx;
		margin-bottom: 20rpx;
		.itemTit{
			font-size: 30rpx;
			color: $sq-main0;
			font-weight: 600;
			margin-bottom: 10rpx;
			.till{
				margin: 0 15rpx;
			}
		}
		.itemBtnGp{
			font-size: 26rpx;
			color: $sq-main8;
			align-items: center;
			.status{
				height: 44rpx;
				line-height: 44rpx;
				padding: 0 20rpx;
				font-size: 24rpx;
				color: $sq-main0;
				background: $sq-fue;
				border:1rpx solid $pss-sq-main;
				border-radius: 10rpx;
				color:$pss-sq-main ;
			}
		}
	}
</style>